<template>
  <div class="school" @click="showName">
      <h2>学校名称：{{name }}</h2>
      <h2>学校地址：{{address}}</h2>
      <button @click="unbind">解绑一个自定义事件</button>
      <button @click="unbinds">解绑多个自定义事件</button>
  </div>
</template>

<script>
    export default {
        name:'School',
        data () {
            return {
                name:'尚硅谷atguigu',
                address:'北京，昌平',
            }
        },
        methods: {
            showName() {
                this.$emit('getName',this.name)
                this.$emit('demo')
            },
            unbind() {
                this.$off('getName') // 解绑一个自定义事件
            },
            unbinds() {
                this.$off(['getName', 'demo']) // 解绑多个自定义事件 写在数组里面
                // this.$off() // 解绑所有自定义事件

                // vc被销毁后，其身上绑定的自定义事件全都不奏效了
            }
        },
    }
</script>

<style scoped>
    .school{
        background-color: skyblue;
        padding: 5px 10px;
        margin: 10px;
    }
</style>